Using an external image editor

You can open a selected image in an external image editor directly from Dreamweaver. When you return to Dreamweaver after saving an image file, any changes you made to the image are visible in the Document window.

You can use Macromedia Fireworks as your external image editor. Fireworks 3 uses Design Notes to determine where the original PNG file is stored on your local hard disk, or will prompt you to navigate to the file.

Fireworks 2 doesn't use Design Notes, but will prompt you to locate the original PNG file. Fireworks 1 automatically searches the folder that contains the selected file for a PNG file with the same name. For example, if you select an image whose source file is images/myPhoto.gif and images/ also contains a file called myPhoto.png, Fireworks opens the PNG file. As Fireworks' native file format, PNG files retain all the original layer, vector, color, and effects information, and all elements are fully editable at all times. Files must have the .png file extension to be recognized as PNG files by Dreamweaver.

If you choose any other image editing application as the external image editor and launch the editor from within Dreamweaver, the application opens the selected image (for example, images/myPhoto.gif). If you prefer, you can manually open the original file from which the GIF was generated (for example, myPhoto.psd might be the original Photoshop file), make any changes, and regenerate the GIF image. Dreamweaver still updates the image in the Document window when you return.

To launch the external image editor, do one of the following:

Hold down Control (Windows) or Command (Macintosh) and double-click the image you want to edit.
Right-click (Windows) or Control-click (Macintosh) the image you want to edit, and choose Edit from the context menu.
Right-click (Windows) or Control-click (Macintosh) the image you want to edit, and choose an external editor from the context menu.
Select the image you want to edit, and click Edit Image in the Property inspector.
Double-click the image file in the Site window to launch the primary image editor. If you haven't specified an image editor, Dreamweaver launches the default editor for the file type.
Note: When you open an image from the Site window, the Fireworks integration features described above are not in effect; Fireworks does not open the original PNG file. To use the Fireworks integration features, open images from within the Document window.


 
Setting external image editor preferences

You can set preferences so that Dreamweaver automatically launches different applications to edit different image types. For example, you can tell Dreamweaver to launch Fireworks when you want to edit a GIF.

To set an external image editor for a specific file type:

1 Choose Edit > Preferences and select External Editors.
2 Click the add (+) button above the Extensions list.
3 Type the file name extension of the type of image you want to edit (for example, .gif), or select one of the listed extensions.
4 Click the add (+) button above the Editors list.
5 In the dialog box that appears, choose the application you want to use to edit this image type.
6 Click Make Primary if you want this editor to be the primary editor for the image type.
Dreamweaver automatically uses the primary editor when you choose to edit this image type. You can choose the other listed editors from the context menu for the image in the Document window.

To change an existing preference:

1 In External Editors preferences, click the file extension whose editor you want to change.
2 Use the add (+) or delete (-) buttons above the Editors list to add or remove an editor.

For more information on the other options in External Editors preferences, see Launching an external media editor.


 
Optimizing an image in Fireworks

If you have Fireworks 2 or Fireworks 3, you can use the Optimize Image in Fireworks command to quickly optimize images for the Web.

To use the Optimize Image in Fireworks command:

1 Select an image in a Dreamweaver document and choose Commands > Optimize Image in Fireworks.
2 If the selected image is a GIF or JPEG file, a dialog box appears asking if you would like to use an existing Fireworks document as the source of the selected image.
Click Yes to open the original PNG file if you created the image in Fireworks.
Click No if you did not create the image in Fireworks and skip to step 4.
3 In the file selection dialog box that appears, navigate to the folder that contains the original Fireworks PNG file, select the file, and click OK.
4 In the dialog box that appears, adjust the setting on the left to change the quality and smoothing of a JPEG or the palette and number of colors in a GIF, or to change from one file format to another.
For more information on the options in this dialog box, see Using Fireworks.
5 The results of your adjustments appear in the Preview pane on the right; the file size and estimated download time for the image are listed at the top of the Preview pane. When you are happy with the appearance and file size of the image, click Update.
If you changed the format of the image, Dreamweaver's link checker prompts you to update references to the image. For example, if you changed the format of an image called my_image from GIF to JPEG, clicking OK at this prompt will change all references to my_image.gif in your site to my_image.jpg.